/* eslint-disable react-hooks/rules-of-hooks */
import React, { useEffect, useState } from "react";
import { Button, Form, Input, Select } from "antd";
import { useLocation, useNavigate } from "react-router-dom";
import { hyd_guanli_update, hyd_guanli_add } from "../../../api/HuangYuDong/huiyi";
import "../../../styles/HuangYuDong/HuiYi/HuiYiShiXiuGai.scss";
interface Props{}
function HuiYiShiXiuGai(props:Props) {
    const { state: record } = useLocation();
    const [form] = Form.useForm()
  const onFinish = (values: any) => {
    console.log("Success:", values);
    if (record === null) {
        hyd_guanli_add({
            name: values.name,
            chengshi: values.chengshi,
            renshu: values.renshu,
            didian: values.didian,
            shebei: values.shebei,
            pic: values.pic,
            beizhu: values.beizhu,
            yuding:values.yuding,
            shenpi:values.shenpi,
            dizhi:values.dizhi,
            zhuangtai:"空闲"
      }).then((ok) => {
        console.log(ok);
        navigate(-1);
      });
    } else {
        hyd_guanli_update({
        id: record.id,
        name: values.name,
        chengshi: values.chengshi,
        renshu: values.renshu,
        didian: values.didian,
        shebei: values.shebei,
        pic: values.pic,
        beizhu: values.beizhu,
        yuding:values.yuding,
        shenpi:values.shenpi,
        dizhi:values.dizhi,
        zhuangtai:"空闲"
      }).then((ok) => {
        console.log(ok);
        navigate(-1);
      });
    }
  };
  useEffect(()=>{
    if(record){
        form.setFieldsValue(record)
    }else{
        form.setFieldsValue("")
    }
  },[])
  let navigate = useNavigate();
  let fanhui = () => {
    navigate(-1);
  };
    return (
        <div className='huiyishi_xiugai'>
      <div className="center">
        <h2>新增会议室</h2>
        <Form
        form={form}
          className="form"
          name="basic"
          initialValues={{ remember: true }}
          onFinish={onFinish}
          autoComplete="off"
          labelCol={{ span: 4 }}
          wrapperCol={{ span: 14 }}
          layout="horizontal"
          style={{ maxWidth: 600 }}
        >
          <Form.Item
            label="会议室名称"
            name="name"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Input />
          </Form.Item>
          <Form.Item
            label="所在城市"
            name="chengshi"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Select>
              <Select.Option value="上海">
              上海
              </Select.Option>
              <Select.Option value="杭州">
              杭州
              </Select.Option>
            </Select>
          </Form.Item>
          <Form.Item
            label="最多容纳人数"
            name="renshu"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Input />
          </Form.Item>
          <Form.Item
            label="设备"
            name="shebei"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Select>
              <Select.Option value="电脑">
              电脑
              </Select.Option>
              <Select.Option value="投影仪">
              投影仪
              </Select.Option>
            </Select>
          </Form.Item>
          <Form.Item
            label="上传照片"
            name="pic"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Input />
          </Form.Item>
          <Form.Item
            label="备注"
            name="beizhu"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Input />
          </Form.Item>
          <Form.Item
            label="所在地点"
            name="didian"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Select>
              <Select.Option value="总公司 总部">总公司 总部</Select.Option>
              <Select.Option value="杭州分部 分公司">杭州分部 分公司</Select.Option>
              <Select.Option value="海南分部 分公司">海南分部 分公司</Select.Option>
              <Select.Option value="天津分部 办事处">天津分部 办事处</Select.Option>
            </Select>
          </Form.Item>
          <Form.Item
            label="具体地址"
            name="dizhi"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Input />
          </Form.Item>
          <Form.Item
            label="允许预定"
            name="yuding"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Select>
              <Select.Option value="允许"> 允许</Select.Option>
              <Select.Option value="不允许">不允许 </Select.Option>
            </Select>
          </Form.Item>
          <Form.Item
            label="预定需审批"
            name="shenpi"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Select>
              <Select.Option value="允许">允许 </Select.Option>
              <Select.Option value="不允许">不允许 </Select.Option>
            </Select>
          </Form.Item>
          <Form.Item wrapperCol={{ offset: 4, span: 16 }}>
            <Button type="primary" htmlType="submit">
              保存
            </Button>
            <Button
              onClick={() => {
                fanhui();
              }}
              className="button_right"
            >
              取消
            </Button>
          </Form.Item>
        </Form>
      </div>
        </div>
    );
}

export default HuiYiShiXiuGai;